import { createRouter, createWebHistory } from 'vue-router';
import store from "@/config/store";
import loginPage from "@/views/LoginPage.vue";
// 定义一个标志，用于判断是否已经获取过动态路由
let isDynamicRoutesFetched = false;
// 假设这是在 routes.js 文件中
const routes = [
    {
        path: '/',
        name: 'Home',
        component: () => import('@/views/HomePage.vue')
    },
    {
        // 登陆
        path: '/login',
        name: 'Login',
        component: () => import('@/views/LoginPage.vue')
    }
];

// 创建路由实例
const router = createRouter({
    // 使用 HTML5 History 模式
    history: createWebHistory(),
    routes
});

// 定义一个函数，用于将后端返回的路由配置转换为 Vue Router 可以识别的路由对象
function generateRoutes(routes) {
    let result = [];
    routes.forEach(route => {
        if (route.component) {
            const newRoute = {
                path: route.path,
                name: route.name,
                meta: route.meta,
                component: () => import(`@/views/${route.component}.vue`)
            };
            // 处理子路由
            if (route.children && route.children.length > 0) {
                newRoute.children = generateRoutes(route.children);
            }
            result.push(newRoute);
        } else if (route.children && route.children.length > 0) {
            // 如果当前路由 component 为 null，递归处理其子路由
            result = result.concat(generateRoutes(route.children));
        }
    });
    return result;
}

// 在路由守卫中获取动态路由
router.beforeEach(async (to, from, next) => {
    try {
        const dynamicRoutes = JSON.parse(sessionStorage.getItem('menus'));
        const token = sessionStorage.getItem('token');
        console.log("token", token);
        const loginPath = "/login";
        // 没有token的情况
        if (!token) {
            // 如果已经要去登录页，直接放行
            if (to.path === loginPath) {
                next();
            } else {
                // 跳转到登录页，并携带当前路径作为redirect参数（方便登录后返回）
                next(`${loginPath}?redirect=${encodeURIComponent(to.fullPath)}`);
            }
            return;
        }
        console.log(token)
        // 只有在未获取过动态路由时才进行获取操作
        if (!isDynamicRoutesFetched && dynamicRoutes.length > 0 && token) {
            // 向后端接口发送请求，获取动态路由配置
            console.log('获取动态路由', dynamicRoutes);
            console.log(typeof dynamicRoutes);
            // 生成可识别的路由对象
            const generatedRoutes = generateRoutes(dynamicRoutes);

            // 将动态路由添加到路由实例中
            generatedRoutes.forEach((route) => {
                router.addRoute('Home', route);
            });

            // 标记为已获取动态路由
            isDynamicRoutesFetched = true;

            console.log("new", router.getRoutes());
            // 重新导航到当前路由，确保路由配置更新生效
            return next({ ...to, replace: true });
        }
        // 如果已经获取过动态路由，直接放行
        next();
    } catch (error) {
        console.error('获取动态路由失败:', error);
        // 出现错误时，继续正常导航
        next();
    }
});

export default router;
    